const {
	editUrl,
	listUrl,
	teamUrl,
} = require('@utils/util-apis')['projectUrl']
const {
	reqPost,
} = require('@utils/request')
const {
	$U_UserInfo,
} = require('@utils/storage')
const {
	saveMethod,
	onRowContextMenu,
	testAPIMethod,
	apiManageMethod,
} = require('./project-methods')

module.exports = function initProjectPage() {
	let {
		projectComp,
	} = $['components-jq']
	projectComp.dailogComp = {
		formDialog: $("#project-form-dialog"),
	}
	projectComp.dataGrid = $("#project-table")
	projectComp.projectMenu = $("#project-right-menu")
	projectComp.projectForm = $("#project-form")
	projectComp.formName = $("#project-form-name")
	projectComp.formDesc = $("#project-form-desc")
	projectComp.formServerUrl = $("#project-form-serverurl")
	projectComp.formTeam = $("#project-form-team")
	projectComp.store = {}
	initSelect(projectComp)
	initDailog(projectComp)
	initDataGrid(projectComp)
}

function initDailog(projectComp) {
	let {
		dataGrid,
		projectForm,
		dailogComp,
		formName,
		formDesc,
		formServerUrl,
		formTeam,
	} = projectComp
	let {
		formDialog,
	} = dailogComp
	formDialog.dialog({
		iconCls: 'icon-save',
		resizable: true,
		modal: true,
		closed: true,
		top: 80,
		buttons: [{
			text: '保存',
			iconCls: 'icon-save',
			handler() {
				saveMethod.call(projectComp)
			}
		}, {
			text: '取消',
			iconCls: 'icon-cancel',
			handler() {
				projectForm.form('clear')
				formDialog.dialog('close')
			}
		}]
	})
}

function initSelect(projectComp) {
	let {
		formTeam,
	} = projectComp
	let userInfo = $U_UserInfo()
	formTeam.combobox({
		valueField: 'id',
		textField: 'name',
		required: true,
		url: teamUrl,
		queryParams: {
			user_id: userInfo.id,
			user_role: userInfo.user_role,
		},
	})
}

function initDataGrid(projectComp) {
	let userInfo = $U_UserInfo()
	let {
		store,
		dataGrid,
		dailogComp,
		projectForm,
		formTeam,
		projectMenu,
	} = projectComp
	let {
		formDialog,
	} = dailogComp
	dataGrid.datagrid({
		fit: true,
		fitColumns: true,
		rownumbers: true,
		singleSelect: true,
		scrollOnSelect: true,
		url: listUrl,
		queryParams: {
			user_id: userInfo.id,
			user_role: userInfo.user_role,
		},
		toolbar: [{
			iconCls: 'icon-add',
			text: '新建',
			handler() {
				formTeam.combobox('enable');
				formTeam.combobox('reload');
				store._editFlag = 'add'
				projectForm.form('clear')
				formDialog.dialog('open')
			}
		}, '-', {
			iconCls: 'icon-edit',
			text: '修改',
			handler() {
				store._editFlag = 'update'
				let row = dataGrid.datagrid('getSelected')
				if (!row)
					return false
				formTeam.combobox('disable');
				store._projectId = row.id
				projectForm.form('load', row)
				formDialog.dialog('open')
			}
		}],
		columns: [
			[{
				field: 'id',
				title: 'ID',
				width: 5,
			}, {
				field: 'name',
				title: '项目名',
				width: 30
			}, {
				field: 'version',
				title: '版本',
				width: 10,
			}, {
				field: 'user',
				title: '创建人',
				width: 30,
			}, {
				field: 'team',
				title: '所属团队',
				width: 30,
			}, {
				field: 'create_date',
				title: '创建时间',
				width: 40,
			}, {
				field: 'introduction',
				title: '描述',
				width: 80,
			}]
		],

		onRowContextMenu(e, index, row) {
			onRowContextMenu.call(projectComp, e, index, row)
		},

		onDblClickRow(index, row) {
			apiManageMethod(index, row)
		},
	});
	// 项目右键菜单
	// projectMenu.menu('appendItem', {
	// 	id: 'apiTest',
	// 	text: '接口测试',
	// 	iconCls: 'icon-redo',
	// 	onclick: function() {
	// 		testAPIMethod()
	// 	}
	// }).menu('appendItem', {
	// 	id: 'apiTest',
	// 	text: '接口管理',
	// 	iconCls: 'icon-redo',
	// 	onclick: function() {
	// 		apiManageMethod()
	// 	}
	// })
	projectMenu.menu('appendItem', {
		id: 'apiTest',
		text: '接口管理',
		iconCls: 'icon-redo',
		onclick: function() {
			apiManageMethod()
		}
	})
}